import React, { Suspense } from "react";
// eslint-disable-next-line import/no-extraneous-dependencies
import { useRoutes } from "react-router-dom";
import routers from "./router";
import AppBar from "./AppBar";

function App() {
  const element = useRoutes(routers);
  return (
    <div className="flex flex-col h-screen">
      <div className="flex-none">
        <AppBar />
      </div>
      <Suspense fallback={<div>loading...</div>}>{element}</Suspense>
    </div>
  );
}

export default App;
